<!--
 * @Author: zqx me_zqx@163.com
 * @Date: 2025-06-23 16:19:13
 * @LastEditors: zqx me_zqx@163.com
 * @LastEditTime: 2025-06-26 17:50:56
 * @FilePath: /XMate-h5/src/views/study/mobile/index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div class="flex flex-col h-screen bg-white">
    <courseProgress />
    <div class="flex-auto overflow-y-auto">
      <courseList @clickItem="handleClickItem" />
    </div>
  </div>
</template>

<script>
import courseList from "../components/courseList.vue";
import courseProgress from "../components/courseProgress.vue";
import { mapActions, mapState } from "pinia";
import { useStudyStore } from "@/store";
export default {
  name: "MobileIndex",
  components: {
    courseList,
    courseProgress,
  },
  data() {
    return {
      confId: "",
    };
  },

  mounted() {
    this.confId = this.$route.query.confId;
    console.log("confId: ", this.confId);
    this.getUserkngAction(this.confId);
  },

  methods: {
    ...mapActions(useStudyStore, {
      getUserkngAction: "getUserkngAction",
    }),
    handleClickItem(item) {
      console.log("handleClickItem: ", item);
      this.$router.push({
        name: "studyDetail",
        query: {
          confId: this.confId,
          fileId: item.fileId,
        },
      });
    },
  },

  computed: {
    ...mapState(useStudyStore, {
      courseData: "courseData",
      courseFlatList: "courseFlatList",
      completeProgress: "completeProgress",
    }),
  },
};
</script>

<style lang="less" scoped></style>
